@font-face {
	font-family: IBM Plex Mono;
	src: url(/static/fonts/ibmplexmono.ttf);
}

* {
	font-family: IBM Plex Mono;
}

html, body {
	margin: 0;
	height: 100%;
}

body {
	background-color:black;
}

h1 {
	font-size:25px;
}

h2 {
	font-size:20px
}

@keyframes lightmix {
	0% { color: #3E78B3; }
	25% { color: #B38F90; }
	75% { color: #91B38F; }
	100% { color: #3E78B3; }
}

@keyframes rainbow {
	0% { color: #FF4040; }
	40% { color: #FFFF40; }
	60% { color: #40FFFF; }
	80% { color: #4040FF; }
	100% { color: #FF40FF; }
}

#logo {
	font-size:30px;
	animation: lightmix 10s ease-in-out infinite;
	text-decoration:none;
}

#welcome-heading {
	animation: rainbow 0.5s steps(2) infinite;
}

.nav {
	display: inline-block;
	padding: 20px;
	width: 100%;
}

.nav a {
	float: left;
	display: block;
	text-align: center;
	padding: 10px;
	font-size: 20px;
	vertical-align: middle;
	line-height: 30px;
	color: white;
	text-decoration: none;
}

.text-section {
	display: inline-block;
	padding: 15px;
	width: 100%;
	position: relative;
	left: 20px;
	box-shadow: -5px 0px 1px -4px #3E78B3;
}

.text-section a {
	display: inline-block;
	width: 100%;
}
